<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>布局</title>
<link rel="stylesheet" type="text/css" href="/frontEnd/public/css/common.css"/>
<style type="text/css">
.box{background :#333;height : 100px;margin:0px 5px 10px;line-height:100px;text-align:center;color:#fff;}
</style>
</head>
<body>
<br/>
<br/>
<div class="l_row">
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
	<div class="l_col_1">
		<div class="box">一列</div>
	</div>
</div>
<div class="l_row">
	<div class="l_col_2">
		<div class="box">两列</div>
	</div>
	<div class="l_col_2">
		<div class="box">两列</div>
	</div>
	<div class="l_col_2">
		<div class="box">两列</div>
	</div>
	<div class="l_col_2">
		<div class="box">两列</div>
	</div>
	<div class="l_col_2">
		<div class="box">两列</div>
	</div>
	<div class="l_col_2">
		<div class="box">两列</div>
	</div>
</div>
<div class="l_row">
	<div class="l_col_4">
		<div class="box">四列</div>
	</div>
	<div class="l_col_4">
		<div class="box">四列</div>
	</div>
	<div class="l_col_4">
		<div class="box">四列</div>
	</div>
</div>
<div class="l_row">
	<div class="l_col_6">
		<div class="box">六列</div>
	</div>
	<div class="l_col_6">
		<div class="box">六列</div>
	</div>
</div>
<div class="l_row">
	<div class="l_col_4">
		<div class="box">四列</div>
	</div>
	<div class="l_col_8">
		<div class="box">八列</div>
	</div>
</div>
<div class="l_row">
	<div class="l_col_12">
		<div class="box">十二列</div>
	</div>
</div>
</body>
</html>